<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/include.jsp"%>
<head>
	<script type="text/javascript">
	
		Ext.onReady(function(){
			var leaf = Ext.get("function.leaf");
			
			setOptArea();
			leaf.on("change",function(e){setOptArea();});
			//
			
			var pidBt = Ext.get("pidBt");
			if(pidBt){
				pidBt.on("click",selectParent);
			}	
			
		});	

		function selectParent(){
			var pid = Ext.get("function.parent.id");
			var Tree = Ext.tree;
	   		var tree = new Tree.TreePanel({
	       
	        autoScroll:true,
	        animate:true,
	        enableDD:true,
	        containerScroll: true,
	        rootVisible:false, 
	        
	        loader: new Tree.TreeLoader({
	          			 dataUrl:'<s:url namespace="/function" action="list!getFS.action"/>'
	            		
	        })
	    });


	    // set the root node
	    var root = new Tree.AsyncTreeNode({
	        text: '功能',
	        draggable:false,
	        id:'-1'
	    });
	    tree.setRootNode(root);
		//tree.on("click",function(n){Ext.get("fpi").dom.value=n.id;Ext.get("fpn").dom.value=n.text;alert(tree.getChecked().length+'');});
		//
		var win = new Ext.Window({
		                //applyTo     : 'hello-win',
		                title:"选择父功能",
		                layout      : 'fit',
		                width       : 700,
		                height		:400,
		                closable:false, 
		                closeAction :'close',
		                modal:true, 
		                plain       : true,
		                items:tree,
		                buttons: [
		                
		                {
		                    text     : '确定',
		                    disabled : false,
		                    handler  :function(){
		                    var n = tree.getSelectionModel().getSelectedNode();
		                    if (n == null){
		                     alert("必须选择一个节点");
		                     return;
		             		}
		                    pid.dom.value=n.id;
		                    
		                    win.close();}
		                },
		                {
		                    text     : '取消',
		                    disabled : false,
		                    handler  :function(){
		                   
		                    win.close();}
		                }]
		            });
	    // render the tree
	    win.show();
		
		}
        function setOptArea(){
        	var leaf = Ext.get("function.leaf");
			var optArea  = Ext.get("optArea");
			var funParams  = Ext.get("funParams");
			
			if(leaf.dom.value=='true'){
				 optArea.setVisible(true);
				 funParams.setVisible(true);
				 Ext.getBody().select(".leaf").each(function(e){
						e.dom.disabled=false;
						e.dom.readonly=false;
						//e.setVisible(true);
						e.removeClass('dontValidate');
				
				});
			  }
			 else{
				 optArea.setVisible(false);
				 funParams.setVisible(false);
				 
				 Ext.getBody().select(".leaf").each(function(e){
				   e.dom.disabled=true;
				   e.dom.readonly=true;
				   //e.setVisible(false);
				   e.addClass('dontValidate');
				});
			}
			//屏蔽枝不需要的字段
			Ext.ValidateFramework.domChanged();
        }
		
	</script>
</head>
<body>
<div class="main">
<div class="main_title"><b>你当前的位置</b>：功能管理-新增/修改</div>
<s:form id="addForm" namespace="/function" action="addOrUpdate!addOrUpdate.action" method="post">
<s:if test="function.id != null">
<s:hidden name="function.id"/>
</s:if>
<s:if test="function.parent != null && function.parent.id != null">
 <s:hidden id="function.parent.id" name="function.parent.id"/>
</s:if>

<table align="center"  cellpadding="1" cellspacing="1" class="tablelist">
	<tr class="listr4">    		
    	<td colspan="4">
			<b>功能菜单</b>
		</td>			
	</tr>
	<s:if test="hasErrors()">
		<s:if test="hasFieldErrors()">
			<tr align="center">
				<td class="textError"><font color="red" size="4"><s:fielderror/></font></td>
				<td class="tableHeader2"></td>
			</tr>
		</s:if>
		<s:if test="hasActionErrors">
			<tr align="center">
				<td class="textError"><font color="blue"><s:actionerror/></font></td>
				<td class="tableHeader2"></td>
			</tr>
		</s:if>	
	</s:if>
	<s:if test="function.parent.name != null">
		<tr class="listr2">
	        <td align="right" class="listr6">父功能</td>
			<td align="left" class="listr5" colspan="3"><s:property value="function.parent.name"/><a href="javascript:void(0);" id="pidBt"><font size="1">修改父功能</font></a></td>			
		</tr>
	</s:if>
	<tr class="listr2">
        <td align="right" class="listr6"><span class="fontred">*</span>枝/叶子</td>
		<td align="left" class="listr5"><s:select id="function.leaf" cssStyle="width:162px; border:1px solid #7F9DB9;" disabled="%{function.id!=null}" name="function.leaf" list='#{true:"叶子",false:"枝"}'/></td>
		<td align="right" class="listr6"><span class="fontred">*</span>功能地址</td>
		<td align="left" class="listr5"><s:textfield cssClass="leaf" name="function.addresss" validate="{type:'required'}" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" /></td>
	</tr>
	<tr class="listr2">
		<td align="right" class="listr6"><span class="fontred">*</span>功能名</td>
		<td align="left" class="listr5"><s:textfield name="function.name" validate="{type:'required'}" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" /></td>
		<td align="right" class="listr6"><span class="fontred">*</span>功能类型</td>
		<td align="left" class="listr5"><s:select name="function.functionType" list='#{1:"查询",2:"新增/修改",3:"查看"}' cssStyle="width:162px; border:1px solid #7F9DB9;" /></td>	
	</tr>
	<tr class="listr2">
		<td align="right" class="listr6"><span class="fontred">*</span>功能号</td>
		<td align="left" class="listr5"><s:textfield validate="{type:'required'}" cssClass="leaf" name="function.functionCode" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px"/></td>
		<td align="right" class="listr6"><span class="fontred">*</span>是否过滤</td>
		<td align="left" class="listr5"><s:select name="function.filter" validate="{type:'required'}" cssClass="leaf"  list='#{true:"是",false:"否"}' cssStyle="width:162px; border:1px solid #7F9DB9;"/></td>
	
	</tr>	
	<tr class="listr2">
		<td align="right" class="listr6"><span class="fontred">*</span>排序号</td>
		<td align="left" class="listr5"><s:textfield  name="function.orderNum" cssClass="searchInput" validate="{type:'float',config:{allowBlank:false}}" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px"/></td>
		<td align="right" class="listr6"><span class="fontred">*</span>是否显示</td>
		<td align="left" class="listr5"><s:select name="function.show" list='#{true:"是",false:"否"}' cssStyle="width:162px; border:1px solid #7F9DB9;"/></td>
	
	</tr>
</table>
<div >
	<s:submit cssClass="btn" onmouseover="this.className='btn_hover'" onmouseout="this.className='btn'" value="提交" ></s:submit>
	<input  type="reset" class="btn" onmouseover="this.className='btn_hover'" onmouseout="this.className='btn'" value="重置" />
	<input name="back" type="button" class="btn" onmouseover="this.className='btn_hover'" onmouseout="this.className='btn'" value="返回" onclick="location.href='list.action'" />
</div>
<div>&nbsp;</div>
<div id="optArea">
<div class="tleft"></div>
<div class="tright"></div>
<table align="center"  cellpadding="1" cellspacing="1" class="tablelist">
<tr class="listr4"><td><b>功能点</b></td></tr>
</table>
<table cellpadding="1" cellspacing="1"  class="tableInput">
	<s:iterator value="function.fields" status="status">
	<tr>
		<s:hidden name="function.fields[%{#status.index}].id" value="%{id}"/>
		<s:hidden name="function.fields[%{#status.index}].fieldClass" value="3"/>
		<td width="10%" class="tableHeader2"><span class="fontred">*</span>操作名:</td>
		<td width="24%" class="tableHeader3"><s:textfield value="%{fieldName}" cssClass="leaf" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" validate="{type:'required'}" name="function.fields[%{#status.index}].fieldName" /></td>
		<td width="10%" class="tableHeader2"><span class="fontred">*</span>操作地址:</td>
		<td width="24%" class="tableHeader3"><s:textfield value="%{fieldDesc}" cssClass="leaf" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" validate="{type:'required'}" name="function.fields[%{#status.index}].fieldDesc"/>
		<a href="#" onclick='javascript:deleteFiled(<s:property  value="%{#status.index}"/>);return false;'>删除</a>	
		</td>
	</tr>
	</s:iterator>
</table>
<div class="tableHeader4">
<script>
	function addNewFiled(form){
		var action = '<s:url namespace="/function" includeParams="false" action="addOrUpdate!addNewField"/>';
		form.action = action;
		form.submit();
	}
	function deleteFiled(num){
		var action = '<s:url includeParams="false" namespace="/function" action="addOrUpdate!deleteField"/>';
		var addForm = Ext.fly("addForm").dom;
		addForm.action = action+'?deleteFieldIndex='+num;
		addForm.submit();
	}
</script>
	<input type="button" class="btn" onmouseover="this.className='btn_hover'" onmouseout="this.className='btn'" value="添加操作" onclick="addNewFiled(this.form);"/>
</div>
</div>
<div>&nbsp;</div>
<div id="funParams">
<div class="tleft"></div>
<div class="tright"></div>
<table align="center"  cellpadding="1" cellspacing="1" class="tablelist">
<tr class="listr4"><td><b>功能参数</b></td></tr>
</table>
<table cellpadding="1" cellspacing="1"  class="tableInput">
	<s:iterator value="function.params" status="status">
	<tr>
		<s:hidden name="function.params[%{#status.index}].id" value="%{id}"/>
		<td width="8%" class="tableHeader2"><span class="fontred">*</span>参数名:</td>
		<td width="16%" class="tableHeader3"><s:textfield value="%{parameterName}" cssClass="leaf" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" validate="{type:'required'}" name="function.params[%{#status.index}].parameterName" /></td>
		<td width="10%" class="tableHeader2"><span class="fontred">*</span>所属组:</td>
		<td width="10%" class="tableHeader3"><s:textfield value="%{parameterGroup}" cssClass="leaf" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" validate="{type:'required'}" name="function.params[%{#status.index}].parameterGroup"/></td>
		<td width="10%" class="tableHeader2"><span class="fontred">*</span>类型:</td>
		<td width="10%" class="tableHeader3"><s:select list='#{0:"SQL语句",1:"字符串数组",2:"字符串",3:"日期",4:"时间"}'  cssClass="leaf" cssStyle="width:162px; border:1px solid #7F9DB9;" validate="{type:'required'}" name="function.params[%{#status.index}].parameterType" /></td>
		<td width="10%" class="tableHeader2">说明:</td>
		<td width="24%" class="tableHeader3"><s:textfield  value="%{remark}" cssClass="leaf" cssStyle="width:154px; border:1px solid #7F9DB9; height:16px;padding-top:2px;margin-top:2px" name="function.params[%{#status.index}].remark" />	
		<a href="#" onclick='javascript:deleteParam(<s:property  value="%{#status.index}"/>);return false;'>删除</a>	
		</td>
		
	</tr>
	</s:iterator>
</table>
<div class="tableHeader4">
<script>
	function addNewParam(form){
		var action = '<s:url namespace="/function" includeParams="false" action="addOrUpdate!addNewParam"/>';
		form.action = action;
		form.submit();
	}
	function deleteParam(num){
		var action = '<s:url includeParams="false" namespace="/function" action="addOrUpdate!deleteParam"/>';
		var addForm = Ext.fly("addForm").dom;
		addForm.action = action+'?deleteFieldIndex='+num;
		addForm.submit();
	}
</script>
	<input type="button" class="btn" onmouseover="this.className='btn_hover'" onmouseout="this.className='btn'" value="添加参数" onclick="addNewParam(this.form);"/>
</div>
</div>
</s:form>
</div>
</body>